<template>
	<uni-nav-bar title="安蓝加注站" left-icon="left" @clickLeft="navBack" :fixed="true" statusBar></uni-nav-bar>
	<scroll-view scroll-y="true" enable-back-to-top @scrolltolower="loadMore" class="scroll-box"
		:style="{ height: pageHeight + 'px' }">
		<view class="package space-between" v-for="item in rehydration" :key="item.id" style="padding:30rpx 20rpx"
			@click="navTo('administrator/rehydrator/rehyDetail?id='+item.id)">
			<view>{{item.name}}</view>
			<uni-icons type="forward" size="25" color="#999"></uni-icons>
		</view>
	</scroll-view>
	<view class="add" @click="navTo('administrator/rehydrator/addrehydrator')">新增加注站</view>
</template>

<script setup lang="ts">
	import { navBack, navTo } from '@/utils/navigator';
	import { ref } from 'vue';
	import { onShow } from '@dcloudio/uni-app';
	import { toPublish } from '@mqtt';
	import { getDeliveryList } from '@/gql/administrator';
	import { showLoading } from '@/utils/prompt';
	const pageHeight = ref();
	const rehydration = ref([])
	uni.getSystemInfo({
		success: function (res) {
			pageHeight.value = res.windowHeight - 120;
		},
	});
	onShow(() => {
		rehydration.value = []
		init()
	})
	//补液站列表
	function init() {
		showLoading('正在加载');
		const payload = {
			query: getDeliveryList
		};
		toPublish('ql/control/getDeliveryList', payload, (obj : any) => {
			uni.hideLoading();
			const { data } = obj;
			rehydration.value = data.getDeliveryList;
		});
	}
</script>

<style scoped lang="less">
	.add {
		width: 480rpx;
		height: 100rpx;
		background: linear-gradient(-10deg, #2C96F9, #1B91FF);
		border-radius: 5px;
		text-align: center;
		line-height: 100rpx;
		color: #fff;
		margin: 20rpx auto;
		font-size: 32rpx;
	}
</style>